<template>
  <div>
     <el-form :inline="true">
      <el-form-item label="类型">
        <el-input v-model="searchForm.code" placeholder="类型" clearable>
        </el-input>
      </el-form-item>

      <el-form-item label="字典类型">
        <el-select v-model="searchForm.value" clearable placeholder="请选择字典类型">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item>
        <el-button @click.native="getDictTypeList">搜索</el-button>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="dictTypeAddDialogVisible = true"  v-if="hasAuth('sys:dict:save')">新增</el-button>
      </el-form-item>
      <el-form-item>
      <el-button type="primary" plain>清空</el-button>
      </el-form-item>
    </el-form>

     <el-table
      :data="tableData"
      style="width: 100%;margin-bottom: 20px;"
      row-key="id"
      border
      stripe
      default-expand-all
      :header-row-style="{height:'20px'}"
      :header-cell-style="{padding:'0px'}"
      :row-style="{height:'35px'}"
      :cell-style="{padding:'0px'}"
      ><el-table-column
        prop="code"
        label="类型"
        width="180">
      </el-table-column>
      <el-table-column
        prop="describe"
        label="描述"
        width="180">
      </el-table-column>
      <el-table-column
        prop="type"
        label="字典类型"
        width="180">
      </el-table-column>
       <el-table-column
        prop="remark"
        label="备注"
      >
      </el-table-column>
      <el-table-column prop="status" label="状态">
        <template slot-scope="scope">
          <el-tag size="small" v-if="scope.row.status === 0" type="success">正常</el-tag>
          <el-tag size="small" v-else-if="scope.row.status === 1" type="danger">禁用</el-tag>
        </template>
      </el-table-column>
        <el-table-column prop="createTime" label="创建时间">
      </el-table-column>
      <el-table-column prop="operation" label="操作">
        <template slot-scope="scope">
          <el-button type="text" @click="editHandle(scope.row)" slot="reference" icon="el-icon-edit" v-if="hasAuth('sys:menu:update')">编辑</el-button>
          <el-divider direction="vertical" v-if="hasAuth('sys:menu:delete')"></el-divider>
          <template>
            <el-popconfirm title="确定删除吗？" @confirm="delHandle(scope.row.id)">
              <el-button type="text" slot="reference" icon="el-icon-delete" style="color:#F56C6C" v-if="hasAuth('sys:menu:delete')">删除</el-button>
            </el-popconfirm>
          </template>
        </template>
      </el-table-column>
    </el-table>

  </div>
</template>
<script>
export default {
  name: 'Dict',
  data () {
    return {
      searchForm: {
        value: '',
        code: ''
      },
      dictTypeAddDialogVisible: false,
      options: [{
        value: '0',
        label: '系统类'
      }, {
        value: '1',
        label: '业务类'
      }]
    }
  },
  methods: {
    getDictTypeList () {

    }
  },
  created () {
    this.getDictTypeList()
  }
}
</script>
<style scoped>

</style>
